<template>
	<view class="content">
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="backText"></block>
			<block slot="content">{{dataDetail.Title}}</block>
		</cu-custom>
		<!-- 人员照片 -->
		<view v-if="dataDetail.Image!=null&&dataDetail.Image!=''" class="topPicture" style="margin-top: 10px;">
			<view class="topTitle">图片</view>
			<view>
				<image :src="dataDetail.Image" class="topImg" mode="widthFix"></image>
			</view>
		</view>
		<view v-if="dataDetail.Image==null||dataDetail.Image==''" style="height: 20px;width: 100%"></view>
		<!-- 自定义表单数据 -->
		<view v-if="FormData.length>0"  class="topPicture">
			<view class="topTitle">详细信息</view>
			<view class="customFormBox">
				<view v-for="(item,index) in FormData" :key="index" :class="index%2!==0?'eachBox':'eachBoxTwo'">
					<view>{{item.label}}</view>
					<view>{{item.value}}</view>
				</view>
			</view>
		</view>
		<!-- 图片资料 -->
		<view v-if="FileImages.length>0" class="topPicture">
			<view class="topTitle">资料文档</view>
			<view  v-for="(item,index) in FileImages" :key="index" >
				<image :src="ip+item" class="topImg" mode="widthFix"></image>
			</view>
		</view>
		<!-- 文档资料 有文档就显示-->
		<view v-if="Files.length>0" class="topPicture">
			<view class="topTitle">资料文档</view>
			
			<view  v-for="(item,index) in Files" :key="index" class="filesBox">
				<view><text class="text-lg">{{item.split('/')[item.split('/').length-1]}}</text></view>
				<view @click="openDocument(item)" class="btn">查看</view>
			</view>
		</view>
		<view class="extra"> </view>
	</view>
</template>

<script>
import request from '@/common/request.js';
export default{
	data(){
		return{
			FormData:[
			],
			id:'',
			params:{},
			dataDetail:{},
			FileImages:[],
			ip:'',
			Files:[]
		}
	},
	onLoad(options) {
		let that=this
		that.ip=this.$request22.baseUrl1
		
		if (JSON.stringify(options.q)!="{}") {
			// 扫码后接收到的参数
			var url = decodeURIComponent(options.q)
			let id=url.split('=')[1];
			that.GetCustomScanContentById(id);
		}else{
			console.log(options.id)
			that.GetCustomScanContentById(options.id);
		}
		
		
		
		
		// that.id=options.id
		// this.GetCustomScanContentById(options.id)
	},
	methods:{
		GetCustomScanContentById(id){
			uni.showLoading({
				title: '加载中'
			})
			var that = this;
			let opts = {
				url: 'api/GetCustomScanContentById',
				method: 'get'
			};
			that.params.id=id;
			request.httpRequest(opts,that.params).then(res => {
				uni.hideLoading();
				if(res.data.code == 1){
					that.dataDetail=res.data.data;
					that.FormData=res.data.data.ContentJsonList
					let fileImages=res.data.data.FileImages.split(',')
					//that.FileImages
					if(fileImages.length>0){
						for(let j=0;j<fileImages.length;j++){
							let item=fileImages[j]
							if(item!=null&&item!=""){
								that.FileImages.push(item)
							}
						}
					}
					console.log(that.FileImages)
					let files=res.data.data.Files
					if(files!=null&&files!=''){
						if(files.indexOf(',')!=-1){
							let files111=files.split(',')
							for(let j=0;j<files111.length;j++){
								let item=files111[j]
								if(item!=null&&item!=""){
									that.Files.push(item)
								}
							}
						}else{
							that.Files.push(files)
						}
					}
					console.log(that.Files)
					that.dataDetail.baseUrl=this.$request22.baseUrl1
					uni.hideLoading();
					
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
		},
		openDocument(url){
			uni.showLoading({
				title: '下载中...'
			})
			uni.downloadFile({
				url: this.$request22.baseUrl1+url,
				success: function(res) {
					uni.hideLoading();
					uni.showLoading({
						title: '打开中...'
					})
					var filePath = res.tempFilePath;
					uni.openDocument({
						filePath: filePath,
						success: function(res) {
							uni.hideLoading();
						},fail() {
							uni.hideLoading();
							uni.showToast({ title: '文件打开失败', image: '/static/cha.png',duration:3000  });
						}
					});
				},fail() {
					uni.hideLoading();
					uni.showToast({ title: '文件下载失败', image: '/static/cha.png',duration:3000 });
				}
			})
		},
		goPreviewImage(url,baseurl){
			let urls=[]
			for(let i=0;i<url.length;i++){
				urls.push(baseurl+url[i])
			}
			uni.previewImage({
				current:0,
				urls:urls
			});
		},
	}
}
</script>

<style lang="scss" scoped>
	.topPicture{
		width: 90%;
		background-color: #fff;
		border-radius: 10rpx;
		margin-left: 5%;
		margin-bottom: 30rpx;
		padding-top: 20rpx;
		padding-bottom: 20px;
	}
	.topTitle{
		border-left: 10rpx solid #0079FE;
		padding-left: 30rpx;
		margin-left: 30rpx;
		margin-bottom: 30rpx;
		font-size: 35rpx;
	}
	.topImg{
		width: 90%;
		margin-left: 5%;
		margin-bottom: 30rpx;
		border-radius: 10rpx;
	}
	// 自定义表单
	.customFormBox{
		width: 90%;
		margin-left: 5%;
	}
	.eachBox{
		color: #000000;
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 80rpx;
		background-color: rgba(240, 240,240,1);
		font-size: 28rpx;
		padding: 0 20rpx;
	}
	.eachBoxTwo{
		color: #000000;
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 80rpx;
		background-color: #fff;
		font-size: 28rpx;
		padding: 0 20rpx;
	}
	// 资料文档
	.filesBox{
		margin-bottom: 40rpx;
		padding:0 5%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 28rpx;
		// border: 1px solid red;
		.btn{
			color: #fff;
			background-color: #04AE0F;
			width: 150rpx;
			height: 50rpx;
			line-height: 50rpx;
			text-align: center;
			border-radius: 35rpx;
		}
	}
	.extra{
		width: 100%;
		height: 60rpx;
	}
</style>